
import { useEffect, useState } from "react"
import React from "react";
import "./index.css"

// 主页-数据维护页面-定检数据维护页面-新增或编辑弹窗组件-图标组件
interface componentInterface {
    columnList: Array<object>
    sourceList: Array<object>
}
const HomePage_StatisticalQueryPage_AssessmentReportPage_SeeModalComponent_TableComponent: React.FC<componentInterface> = (props) => {

    useEffect(() => {
        return () => {

        }
    }, [])
    return (
        <table className="homePageStatisticalQueryPageAssessmentReportPageSeeModalComponentTableComponent" border={1} style={{ borderCollapse: "collapse" }}>
            <thead>
                <tr>
                    {
                        props.columnList?.map((item, idx) => (
                            <th key={`th${idx}`} className="homePageStatisticalQueryPageAssessmentReportPageSeeModalComponentTableComponent-th" >{item["title"]}</th>
                        ))
                    }
                </tr>
            </thead>
            <tbody>
                {props.sourceList?.map((item, idx) =>
                    <tr key={`tbody${idx}`}>
                        {
                            props.columnList?.map((columnItem, columnIdx) => (
                                <td  key={`td${columnIdx}`} className="homePageStatisticalQueryPageAssessmentReportPageSeeModalComponentTableComponent-td" style={{color:columnItem["color"]}}>{item[columnItem["dataIndex"]]}</td>
                            ))
                        }
                    </tr>
                )
                }
            </tbody>
        </table>
        // <div className="homePageStatisticalQueryPageAssessmentReportPageSeeModalComponentTableComponent" ></div>

    )
}
export default HomePage_StatisticalQueryPage_AssessmentReportPage_SeeModalComponent_TableComponent